<script type="text/javascript">
(function(){
	var localize = localization('${sessionScope["javax.servlet.jsp.jstl.fmt.locale.session"]}');
	
	function Profile(){
		var self = this;
		this.firstname = ko.observable('<c:out value="${user.firstName}" escapeXml="false" default="${unknownVal}"/>');
		this.lastname = ko.observable('<c:out value="${user.lastName}" escapeXml="false" default="${unknownVal}"/>');
		this.fullname = ko.computed(function(){
			return localize.formatName({
						firstname: self.firstname(),
						lastname: self.lastname()
					}).fullname;
		});
		this.email = ko.observable('<c:out value="${user.email}" escapeXml="false" default="${unknownVal}"/>');
		this.username = ko.observable('<c:out value="${user.username}" escapeXml="false" default="${unknownVal}"/>');
		this.genders = ko.observableArray([{'key':'m','value':'<fmt:message key="user.gender.male"/>'},
		                                  {'key':'f','value':'<fmt:message key="user.gender.female"/>'}]);
		this.gender = ko.observable('<c:out value="${user.gender}" escapeXml="false" default="${unknownVal}"/>');
		this.dob = ko.observable('<c:out value="${user.dob}" escapeXml="false" default="${unknownVal}"/>');
		this.phone = ko.observable('<c:out value="${user.phoneNumber}" escapeXml="false" default="${unknownVal}"/>');
		this.address = ko.observable('<c:out value="${user.address.address}" escapeXml="false" default="${unknownVal}"/>');
		this.city = ko.observable('<c:out value="${user.address.city}" escapeXml="false" default="${unknownVal}"/>');
		this.province = ko.observable('<c:out value="${user.address.province}" escapeXml="false" default="${unknownVal}"/>');
		this.postalCode = ko.observable('<c:out value="${user.address.postalCode}" escapeXml="false" default="${unknownVal}"/>');
		this.country = ko.observable('<c:out value="${user.address.country}" escapeXml="false" default="${unknownVal}"/>');
		this.addrDisplay = ko.computed(function(){
			var na = '${unknownVal}';
			var rs = self.address;
			if (self.city != na){
				rs += self.city+" "+'<fmt:message key="user.address.city"/>';
			}
			if (self.province != na){
				rs += self.province+" "+'<fmt:message key="user.address.province"/>';
			}
			if (self.postalCode != na){
				rs += self.province+" "+'<fmt:message key="user.address.province"/>';
			}
			if (self.country != na){
				rs += self.country+" "+'<fmt:message key="user.address.country"/>';
			}
			return rs;
		});
	} 
	var profile = new Profile();
	ko.applyBindings(profile);
//switch to load another validation script
	var switchScript = new SwitchScript('validateScript');
	var $edit = $('#editacc .accsetting').accsetting({
		rowExpand: function($row){
			debug("userform: calling rowExpand");
			var $form = $row.find('form');
			if(!switchScript.isUrlLoaded($form.data('validate'))){
				switchScript.swit($form.data('validate'));
			}
		}
	}).get(0);
	
	$('#editacc').on('hidden',function(){
		$edit.reset();
	});
	
	$('#editfn').submit(function(e){
		e.stopPropagation();
		if(!validateEditfn(this)){
			return false;
		}
		var data = $(this).serialize();
		$.ajat({
			url: 'editaccfn'
			,type: 'post'
			,dataType:'json'
			,data: data
			,spinner: '#editfn .accloading'
			,success: function(result){
				$edit.getActiveRow().changeStatus(result.status,result.message);
				debug(result);
				debug(result.status);
				if(result.status){
					debug("success ajat");
					profile.firstname($edit.getActiveRow().accedit.find('#firstName').val());
					profile.lastname($edit.getActiveRow().accedit.find('#lastName').val());
				}else if(!result.status){
					debug("fail ajat");
				}
			}
		});
		return false;
	});
	
	$('#editemail').submit(function(e){
		e.stopPropagation();
		if(!validateEditemail(this)){
			debug("validate email false");
			return false;
		}
		debug("validate email true");
		var data = $(this).serialize();
		$.ajat({
			url: 'editaccemail'
			,type: 'post'
			,dataType:'json'
			,data: data
			,spinner: '#editemail .accloading'
			,success: function(result){
				$edit.getActiveRow().changeStatus(result.status,result.message);
				debug(result);
				debug(result.status);
				if(result.status){
					debug("success ajat");
					profile.email($edit.getActiveRow().accedit.find('#email').val());
				}else if(!result.status){
					debug("fail ajat");
				}
			}
		});
		
		return false;
	});
	
	$('#editpwd').submit(function(e){
		debug("submit editpwd form");
		e.stopPropagation();
		if(!validateEditpwd(this)){
			return false;
		}
		var data = $(this).serialize();
		$.ajat({
			url: 'editaccpwd'
			,type: 'post'
			,dataType:'json'
			,data: data
			,spinner: '#editpwd .accloading'
			,success: function(result){
				$edit.getActiveRow().changeStatus(result.status,result.message);
				debug(result);
				debug(result.status);
				if(result.status){
					debug("success ajat");
				}else if(!result.status){
					debug("fail ajat");
				}
			}
		});
		
		return false;
	});
	
	$('#editbasicinfo').submit(function(e){
		debug("edit basic info submit");
		e.stopPropagation();
		var data = $(this).serialize();
		debug(data);
		
		$.ajat({
			url:'editbasicinfo'
			,type:'post'
			,dataType:'json'
			,data:data
			,spinner:'#editbasicinfo .accloading'
			,success:function(result){
				for(var prop in data){
					profile[prop](data[prop]);
				}
			}
		});
		return false;
	});
	
	//construct date picker
	$('#dobirth').datepicker({
		startView:2
		});
	
}());
</script>